Right to left 從右到左 (RTL)

支援阿拉伯語和希伯來語等從右到左的語言時,需要根據相關書寫方向調整介面,以適應閱讀順序。

當使用者為裝置或應用選擇 RTL 語言時,介面需要在視覺上自動翻轉。系統提供的 UI 框架會預設支援 RTL 顯示,幫助應用元素自動翻轉。以下是一些 RTL 語言支援的指南:

文字對齊

調整文字對齊以適應介面方向:系統會自動調整文字對齊,您需要確保文字在 LTR 和 RTL 環境中保持一致性。如果系統未自動對齊,您需要手動調整文字方向。例如:

段落對齊應基於其語言,而非當前上下文:不同語言的段落應根據其原有語言對齊。例如,阿拉伯語段落在 RTL 環境下保持右對齊,而如果段落內容為 LTR 語言,則應保持左對齊,即使它出現在 RTL 環境中。

一致性對齊:為確保舒適的閱讀體驗,應對列表中的所有文字項進行一致的對齊,即使列表中的某些項使用不同的書寫系統。例如,列表中的所有項在 RTL 環境中應保持右對齊。

數字與字元

不同的數字系統:不同的 RTL 語言使用不同的數字系統。例如,希伯來語使用西方阿拉伯數字,而阿拉伯語可能使用西方或東部阿拉伯數字。

不要翻轉數字順序:無論當前語言為何,特定數字(如電話號碼、信用卡號等)的順序都應保持不變。例如,數字“541”在任何環境下的順序都應保持為“541”。

逆序顯示進度條和計數方向:進度條、滑塊和評分控制元件經常使用數字顯示其值。在 RTL 環境中,控制元件的方向會翻轉,您需要確保數字的顯示順序與控制元件的方向一致。

示例:在 RTL 環境下,評分控制元件從右到左顯示時,數字順序也應從右到左排列,而不應翻轉每個數字本身。

控制元件 (Controls)

翻轉控制元件以匹配 RTL 方向

在從右到左 (RTL) 的環境中,控制元件需要與使用者介面的視覺順序保持一致。對於顯示進度或值變化的控制元件,控制元件的方向應根據語言的閱讀順序翻轉。例如,滑塊、進度條和評分控制元件應從右向左顯示值或進度,數字顯示也應從右到左排列,確保控制元件的使用與介面一致。

RTL 翻轉示例:在從右到左的環境中,控制元件的順序與內容應同時翻轉,以保持一致性。

翻轉按鈕的順序

當按鈕從左到右排列時,按鈕的功能性順序需要在 RTL 環境下翻轉。例如,下載 (Download)按鈕在 RTL 中的順序應與內容翻轉以保持邏輯一致性。

影象 (Images)

在從右到左的佈局中,如果影象有順序或層級關係,您需要翻轉這些影象的顯示順序。例如:

多張圖片的順序:如果圖片的順序對內容有意義,那麼在 RTL 環境中需要翻轉這些圖片的顯示順序以適應 RTL 佈局。

介面圖示 (Interface Icons)

當您使用SF Symbols提供應用的介面圖示時,您將獲得針對 RTL (從右到左) 環境的變體,以及阿拉伯文、希伯來文等語言的本地化符號。如果您建立了自定義符號,您可以指定它們的方向性。

翻轉與文字或閱讀方向相關的圖示:如果介面圖示在 LTR 環境下使用左對齊的條來表示文字,那麼在 RTL 環境下需要右對齊條來表示相同內容。

LTR 方向的符號示例:左對齊的三條水平線。

RTL 方向的符號示例:右對齊的三條水平線。

考慮建立顯示文字的介面圖示的本地化版本:一些介面圖示包含字母或單詞,以幫助傳達與語言指令碼相關的概念,例如字型大小選擇或簽名。如果有需要顯示實際文字的自定義介面圖示,考慮建立本地化版本。例如,SF Symbols提供了用於拉丁文、希伯來文和阿拉伯文等文字的不同版本的簽名、富文字和 I-beam 指標符號。

示例:在拉丁文環境中的簽名符號和在希伯來文、阿拉伯文環境中的變體。

翻轉顯示前進或後退運動的介面圖示:當圖示顯示與人們閱讀方向一致的運動時,他們通常會將其解釋為前進方向;而與之相反的方向則會被理解為後退。因此,表示前進或後退運動的圖示需要在 RTL 環境中翻轉。例如,表示揚聲器的圖示通常會顯示聲波向前擴散,在 LTR 環境中聲波從左側發出,在 RTL 環境中需要翻轉圖示,使聲波從右側發出。

LTR 方向的揚聲器圖示示例:聲波從右側擴散。

RTL 方向的揚聲器圖示示例:聲波從左側擴散。

避免翻轉徽標或通用符號:翻轉徽標會讓使用者感到困惑,並且可能引發法律問題。始終以原始形式顯示徽標,即使它包含文字也不應翻轉。人們期望像對號這種通用符號在所有情況下都保持一致的外觀。

示例Apple TV徽標和對號符號應始終保持一致外觀,無需翻轉。

一般不應翻轉的圖示:通常,介面圖示如果表示真實世界的物件,而不是方向性符號,則不應翻轉。例如,鐘錶在任何地方的運作方式都是一樣的,因此鐘錶圖示不應根據語言方向進行翻轉。某些圖示看似與語言或閱讀方向有關,但實際上表示的是特定工具的使用習慣,大多數情況下不需要翻轉。

示例:鉛筆圖示表示的是右手書寫工具,不需要根據 RTL 進行翻轉。

為複雜的自定義介面圖示保持視覺平衡:當考慮是否翻轉自定義圖示時,請仔細考慮其各個元件和整體的視覺平衡。例如,有些符號,如斜槓,表示禁止或否定,在 LTR 和 RTL 版本中應保持一致,以確保視覺一致性。

示例:斜槓符號在 LTR 和 RTL 版本中應保持一致,確保視覺一致性。

在某些情況下,您可能需要翻轉某個元件或其位置,以確保本地化圖示仍然合理。例如,如果徽章表示使用者介面的實際元素,則在介面翻轉時應同步翻轉徽章。

示例:購物車圖示的加號符號,在 RTL 環境下應根據圖示位置合理調整。

如果您的自定義圖示包含可能暗示工具使用方向的元件,如錘子或剪刀等,請考慮在需要時只翻轉基礎影象,保持工具的方向不變。